// Create a variable to hold our EXT Form Panel.
// Assign various config options as seen.
Ext.namespace('jun');
jun.login = new Ext.extend(Ext.Window, {
    //labelWidth:80,
    width: 300,
    height: 140,
    layout: 'form',
    url: 'site/authLogin/',
    modal: true,
    closable: false,
    resizable: false,
    plain: true,
    border: false,
    title: 'Please Login',
    padding: 5,
    initComponent: function() {
        this.items = [
            {
                xtype: 'form',
                frame: false,
                bodyStyle: 'background-color: #E4E4E4; padding: 10px',
                id: 'form-Login',
                //labelWidth: 100,
                labelAlign: 'left',
                layout: 'form',
                ref: 'formz',
                border: false,
                plain: true,
                items: [
                    {
                        xtype: 'textfield',
                        hideLabel: false,
                        //hidden:true,
                        id: 'usernameid',
                        ref: '../username',
                        maxLength: 128,
                        //allowBlank: ,
                        anchor: '100%',
                        fieldLabel: 'Username',
                        name: 'loginUsername',
                        allowBlank: false
                    },
                    {
                        xtype: 'textfield',
                        hideLabel: false,
                        //hidden:true,
                        id: 'passwordid',
                        ref: '../password',
                        maxLength: 128,
                        //allowBlank: ,
                        anchor: '100%',
                        fieldLabel: 'Password',
                        name: 'loginPassword',
                        inputType: 'password',
                        allowBlank: false
                    }
                ]
            }
        ];
        this.fbar = {
            xtype: 'toolbar',
            items: [
                {
                    xtype: 'button',
                    text: 'Login',
                    hidden: false,
                    ref: '../btnLogin'
                }
            ]
        };
        jun.login.superclass.initComponent.call(this);
        this.btnLogin.on('click', this.onbtnLoginClick, this);
    },
    onbtnLoginClick: function() {
        Ext.getCmp('form-Login').getForm().submit({
            //method:'POST',
            url: 'login',
            waitTitle: 'Connecting',
            waitMsg: 'Sending data...',
            success: function(form, action) {                
                    var obj = Ext.util.JSON.decode(action.response.responseText);
                    if(obj.success == 'true'){
                        var redirect = "..";
                        window.location = redirect;
                    }
                    else{
                        Ext.Msg.alert('Login Failed!', obj.msg);
                    }
                    Ext.getCmp('form-Login').getForm().reset();                                                 
            },
            failure: function(form, action) {
                if (action.failureType == 'server') {
                    var obj = Ext.util.JSON.decode(action.response.responseText);
                    Ext.Msg.alert('Login Failed!', obj.msg);
                } else {
                    Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' + action.response.responseText);
                }
                Ext.getCmp('form-Login').getForm().reset();
            }
        });
    }
});

Ext.onReady(function() {
    var hideMask = function() {
        Ext.get('loading').remove();
        Ext.fly('loading-mask').fadeOut({
            remove: true
                    //callback : firebugWarning
        });
    }
//    hideMask.defer(50);
    Ext.QuickTips.init();
    var myViewport = new jun.login({
    });
    myViewport.show();
});
